export let captureMouse = function(element){
            //定义一个名为mouse的对象
    let mouse = {x:0,y:0};
    
    //为元素绑定mousemove事件
    element.addEventListener('mousemove',function(event){
        let x,y;
        
        //获取鼠标位于当前屏幕的位置， 并作兼容处理
        if(event.pageX||event.pageY){
            x = event.pageX;
            y = event.pageY;
        }else{
            x = event.clientX + document.body.scrollLeft +document.documentElement.scrollLeft;
            y = event.clientY + document.body.scrollTop +document.documentElement.scrollTop;
        }
        //将当前的坐标值减去元素的偏移位置，即为鼠标位于当前canvas的位置
        x -= element.offsetLeft;
        y -= element.offsetTop;

        mouse.x = x;
        mouse.y = y;
    },false);
     //返回值为mouse对象
     return mouse;
}
export let getMouse = function(event){
    //定义一个名为mouse的对象
    let mouse = {x:0,y:0};
    let x,y;
    //获取鼠标位于当前屏幕的位置， 并作兼容处理
    if(event.pageX||event.pageY){
        x = event.pageX;
        y = event.pageY;
    }else{
        x = event.clientX + document.body.scrollLeft +document.documentElement.scrollLeft;
        y = event.clientY + document.body.scrollTop +document.documentElement.scrollTop;
    }
    //将当前的坐标值减去元素的偏移位置，即为鼠标位于当前canvas的位置
    x -= event.currentTarget.offsetLeft;
    y -= event.currentTarget.offsetTop;

    mouse.x = x;
    mouse.y = y;
 //返回值为mouse对象
    return mouse;
}
//requestAnimationFrame 的兼容处理
export let fixRequestAnimationFrame = function(){
    if(!window.requestAnimationFrame){
    window.requestAnimationFrame =(window.webkitRequestAnimationFrame||
                                   window.mozRequestAnimationFrame||
                                   window.oRequestAnimationFrame||
                                   window.msRequestAnimationFrame||
                                   function(callback){
                                       return window.setTimeout(callback,1000/60); 
                                 });
    
}

export let clearCanvas = function(obj){
    obj.clearRect(0, 0, obj.canvas.width, obj.canvas.height)
}

//画一个箭头
class Arrow{
    constructor(){
        this.x = 0
        this.y = 0
        this.rotation = 0
        this.color = '#ff0'
    }
    drow(ctx){
        ctx.save()
        ctx.translate(this.x, this.y)
        ctx.rotate(this.rotation)
        ctx.lineWidth = 5
        ctx.fillStyle = this.color
        ctx.beginPath()
        ctx.moveTo(-50, -25)
        ctx.lineTo(0, -25)
        ctx.lineTo(0, -50)
        ctx.lineTo(50, 0)
        ctx.lineTo(0, 50)
        ctx.lineTo(0, 25)
        ctx.lineTo(-50, 25)
        ctx.closePath()
        ctx.stroke()
        ctx.fill()
        ctx.restore()
    }
}
export let time = function(){
    return parseInt(new Date().getValue() / 1000)
}
//画一个水草
class Aqu{
    constructor({color = '#3ff333', num = 60, ctx = null} = {}){
        this.startPoint = []
        this.endPointX = []
        this.endPointY = []
        this.beta = 0
        this.color = color
        this.num = num
        this.apm = apm
        this.ctx = ctx
        this.canvas = ctx.canvas
    }
    init(){
        for(let i = 0; i < this.num; i++){
            this.startPoint[i] = Math.random() * 20 + i * 10
            this.endPointX[i] = this.startPoint[i]
            this.endPointY[i] = this.canvas.height / 1.5 - Math.random() * 50
            this.apm[i] = Math.random() * 10 + 40
        }
    }
    
    draw(del){
        let ctx = this.ctx
        ctx.save()
        ctx.lineWidth = 14
        ctx.lineCap = 'round'
        ctx.globalAlpha = 0.8
        ctx.strokeStyle = this.color
        this.beta += del * 0.0012
        let l = Math.sin(this.beta)
        for(let i = 0; i < this.num; i++){
            ctx.beginPath()
            ctx.moveTo(this.startPoint[i], this.canvas.height)
            this.endPointX[i] = this.startPoint[i] + l * this.amp[i]
            ctx.quadraticCurveTo(this.startPoint[i], this.canvas.height - 120, this.endPointX[i], this.endPointY[i])
            ctx.stroke()
        }
        ctx.restore()
    }
}

